/*
 * @Author: xiaosihan
 * @Date: 2022-07-11 07:51:56
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-06-07 01:27:03
 */

import hashHistory from '@hashHistory';
import { Button } from 'antd';
import { autorun } from 'mobx';
import { useEffect, useState } from 'react';
import home2Store from './home2Store';
import styles from './index.module.less';
import AnyCom from './AnyCom';

const Home2 = () => {
  const [storeValue, setStoreValue] = useState(home2Store.value);

  useEffect(() => {
    const disposer = autorun(() => {
      const { value } = home2Store;
      setStoreValue(value);
      console.log(value);
    });
    return () => disposer(); // 组件销毁时，必须清除监听 autorun
  }, []);

  return (
    <div>
      <div>hooks写法</div>
      <div>我是父组件全局状态： {storeValue}</div>
      <Button onClick={() => home2Store.setValue(storeValue + 1)}>设置store</Button>
      <AnyCom />

      <Button
        type="link"
        onClick={() => {
          hashHistory.push('/class');
        }}
      >
        去看看 Class 组件写法
      </Button>
    </div>
  );
};

export default Home2;
